<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        //javascript 高阶函数 
        function add(x, y, f) {
            return f(x) + f(y);
        }
        //当调用add(-5, 6, Math.abs)时，参数x，y和f分别接收-5，6和函数Math.abs，根据函数定义，可以推导计算过程为：
        //x = -5;
        //y = 6;
        //f = Math.abs;
        //f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11;
        //return 11;

        //用代码验证一下：
        add(-5, 6, Math.abs); //11

        //1.map用法
        // function pow(x) {
        //     return x * x;
        // }

        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        //arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
        //console.log(arr.map(pow));
        var abc = arr.map(function (x) {
            return x * x;
        })
        console.log(abc);
        //map()传入的参数是pow，即函数对象本身。

        //不需要map()，写一个循环，也可以计算出结果：

        var f = function (x) {
            return x * x;
        };
        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        var result = [];
        for (var i = 0; i < arr.length; i++) {
            result.push(f(arr[i]));
        }
        //的确可以，但是，从上面的循环代码，我们无法一眼看明白“把f(x)作用在Array的每一个元素并把结果生成一个新的Array”。

        //2.reduce用法  reduce()把结果继续和序列的下一个元素做累积计算
        //[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
        //比方说对一个Array求和，就可以用reduce实现：
        var arr = [1, 3, 5, 7, 9];
        var att = arr.reduce(function (x, y) {
            return x + y;
        }); // 25、
        console.log(att);
        //3.filter 用法  filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素。
        //例如，在一个Array中，删掉偶数，只保留奇数，可以这么写：
        var arr = [1, 2, 4, 5, 6, 9, 10, 15];
        var r = arr.filter(function (x) {
            return x % 2 !== 0;
        });
        console.log(r); // [1, 5, 9, 15]
        //把一个Array中的空字符串删掉，可以这么写：
        var arr = ['A', '', 'B', null, undefined, 'C', '  '];
        var r = arr.filter(function (s) {
            return s && s.trim(); // 注意：IE9以下的版本没有trim()方法
        });
        console.log(arr); // ['A', 'B', 'C']    

        //利用filter，可以巧妙地去除Array的重复元素：
        var r,
            arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
        r = arr.filter(function (element, index, self) {
            return self.indexOf(element) === index;
        });
        console.log(r.toString());
        //4.sort 排序算法 
        var arr = [10, 20, 1, 2];
       var arrs= arr.sort(function (x, y) {
            if (x < y) {
                return -1;
            }
            if (x > y) {
                return 1;
            }
            return 0;
        }); // [1, 2, 10, 20]
        console.log(arrs);
        
    </script>
</body>

</html>